/**
* 菜单食谱
*/
<template>
	<view>
		<cu-custom bgColor="v-bg-main v-font-white" :isBack="true">
			<block slot="backText">返回</block>
			<block slot="content">菜单食谱</block>
		</cu-custom>
		<block v-for="(item,index) in data" :key="index">
			<view v-if="index > 0" class="v-bg-division" style="height: 40upx;width: 100%;"></view>
			<view class="reipes-font">
				<view class="reipes-title reipes-padding">{{item.name}}</view>
				<view class="reipes-padding">
					<view style="padding: 20upx 20px 20px 0px;font-size: 20px;">制作方法</view>
					<view class="">
						<text>【食材】</text><text class="reipes-conter">{{item.foods}}</text>
					</view>
					<view class="">
						<view class="">
							【做法】
						</view>
						<view class="reipes-conter" style="padding-left: 10upx;">
							<view class="" v-for="(items,indexs) in item.step" :key="indexs">{{items}}</view>
						</view>
					</view>
					<view class="">
						<text>【功效】</text><text class="reipes-conter">{{item.effect}}</text>
					</view>
				</view>
			</view>
		</block>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				data:[]
			}
		},
		onLoad(e) {
			const that = this;
			const id = e.id;
			const url = that.$profile.url + "/console/checkRecipes/rewrite/selectId";
			that.$http.post(url,{id:id}).then(res=>{
				for (var i = 0; i < res.data.length; i++) {
					res.data[i].step = res.data[i].step.split(/[\n]/g);
				}
				that.data = res.data;
			})
		},
		methods: {

		}
	}
</script>

<style scoped>
	.reipes-conter{
		color: #949494;
	}
	.reipes-title{
		border-bottom: 6upx solid #EAEAEA;
		padding-bottom: 30upx;
		font-size: 40upx;
		font-weight: 600;
	}
	.reipes-padding{
		padding: 0upx 40upx 30upx 40upx;
	}
	.reipes-font{
		padding: 40upx 0upx;
		font-size: 30upx;
		line-height: 50upx;
	}
</style>
